<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<link href="style/style.css" rel="stylesheet" type="text/css">
<link href="style/global.css" rel="stylesheet" type="text/css"><script type="text/javascript" src="<%=basePath%>/js/global.js"></script>
<jsp:include page="/extInclude.jsp" />
<link rel="stylesheet" type="text/css"
	href="<%=basePath%>/js/ext/ux/css/MultiSelect.css" />
<script type="text/javascript"
	src="<%=basePath%>/js/ext/ux/MultiSelect.js"></script>
<script type="text/javascript"
	src="<%=basePath%>/js/ext/ux/ItemSelector.js"></script>
	<style>
.x-tree-node-cb{
display:none;
}
</style>
<script type="text/javascript">
var nodeid;
Ext.onReady(function(){
var deptTree = new Ext.tree.TreePanel({
                    id : 'treePanels',
                    title : '按部门分类 ',
                    iconCls:'dep-user',
                    autoScroll:true,
                    loader : new Ext.tree.TreeLoader({
                                url : _ctxPath + '/genDeptTree.do'
                            }),
                    root : new Ext.tree.AsyncTreeNode({
                                nodeType : 'async',
                                text:'组织机构',
                                id : 34000000,
                                expanded : true
                            }),
                    rootVisible : false,
                    listeners : {
                        'click' : function(node,e){
                            nodeid=node.id;
                            dssel.load({params:{
                            'bmid':node.id,
                            'roleid':'${role.id}'
                            }});
                        }
                    }
                });
                
                var ds = new Ext.data.JsonStore({
                            url : 'userList.do',
                            autoLoad:false,
                            root : 'list',
                            idProperty : 'value',
                         fields : ['value', 'text']
                        });
                var dssel = new Ext.data.JsonStore({
                            url : 'userList.do',
                            autoLoad:false,
                            root : 'list',
                         fields : ['value', 'text']
                        });
                
                var isForm = new Ext.form.FormPanel({
                id : 'xqselector',
                width : 500,
                bodyStyle : 'padding:10px;',
                autoScroll:true,
                items : [{
                    xtype : 'itemselector',
                    id:'itemselector',
                    name : 'userids',
                    fieldLabel : '${role.name}',
                    imagePath : _ctxPath + '/js/ext/ux/images/',
                    multiselects : [{
                                legend: '可供选择',
                                width : 150,
                                height : 300,
                                store : ds,
                                autoLoad:false,
                                displayField : 'text',
                                valueField : 'text'
                            }, {
                                legend: '已选择',
                                width : 150,
                                height : 300,
                                autoLoad:false,
                                displayField : 'text',
                                valueField : 'value',
                                store : dssel,
                                tbar : [{
                                    text : '清空',
                                    handler : function() {
                                        isForm.getForm().findField('userids')
                                                .reset();
                                    }
                                }]
                            }],
                         listeners:{
                            'change':function(){
                                ds.load({params:{
                                'bmid':nodeid==undefined?-1:nodeid,
                                'ids' : isForm.getForm() .findField('userids').getValue(),
                                'cascade':0//不级联
                                }});
                            }
                         }
                }],
                buttons : [{
                    text : '确定',
                    handler : function() {
                    	var o=Ext.getCmp('itemselector').multiselects[0].store.data.keys;
                        Ext.Ajax.request({
                            url : 'roleUser.do',
                            method : 'POST',
                            params : {
                                op : 'ajax',
                                'role.id' : ${role.id},
                                'userids' : isForm.getForm() .findField('userids').getValue(),
                                'ids':o.join()
                            },
                            success : function(response, options) {
                                var res = Ext.util.JSON
                                        .decode(response.responseText);
                                if (res.success) {
                                    Ext.Msg.alert('操作信息', '保存成功！');
                                } else {
                                    Ext.Msg.alert('操作信息', '保存失败！');
                                }
                            },
                            failure : function(response, options) {
                                Ext.Msg.alert('操作信息', '保存失败！');
                            },
                            scope : this
                        });
                    }
                }]
            });
                
                var contactPanel = new Ext.Panel({
                    id : 'contactPanel',
                    renderTo:'dep-tree',
                    autoWidth : true,
                    height : 400,
                    layout : 'border',
                    border : false,
                    items : [{
                                region : 'west',
                                split : true,
                                collapsible : true,
                                width : 200,
                                margins : '5 0 5 5',
                                layout : 'accordion',
                                items : deptTree
                            }, {
                                region : 'center',
                                collapsible : true,
                                width : 400,
                                margins : '5 0 5 5',
                                items : isForm
                            }]
                });
})
</script>
<input type=hidden id='deptid' />
<input type=hidden id='deptname' />
<div class="rightCon" align="center">
	<div class="rightTitle" align="left">
		<h3>
			<s:property value="nav" escape="false"/>
		</h3>
	</div>
	<table class="listTable">
		<tr class="listTitle">
			<td align="left">
				<div id="dep-tree" style="float: left;"></div>
			</td>
		</tr>
	</table>
</div>